package com.example.socialapp.ui.main.screens

import androidx.compose.foundation.Image
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Search
import androidx.compose.material3.Divider
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp

/**
 * 联系人屏幕，显示用户的联系人列表
 */
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun ContactsScreen(
    onContactClick: (String) -> Unit = {}
) {
    var searchQuery by remember { mutableStateOf("") }
    val contacts = remember { getDummyContacts() }
    var filteredContacts = remember(searchQuery, contacts) {
        if (searchQuery.isEmpty()) {
            contacts
        } else {
            contacts.filter { 
                it.name.contains(searchQuery, ignoreCase = true) 
            }
        }
    }

    Scaffold(
        topBar = {
            TopAppBar(
                title = { Text("联系人") }
            )
        }
    ) { paddingValues ->
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(paddingValues)
        ) {
            // 搜索框
            OutlinedTextField(
                value = searchQuery,
                onValueChange = { searchQuery = it },
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(16.dp),
                placeholder = { Text("搜索联系人") },
                leadingIcon = {
                    Icon(
                        imageVector = Icons.Default.Search,
                        contentDescription = "搜索"
                    )
                },
                singleLine = true
            )
            
            if (filteredContacts.isEmpty()) {
                // 无联系人时显示空状态
                Box(
                    modifier = Modifier.fillMaxSize(),
                    contentAlignment = Alignment.Center
                ) {
                    Text(
                        text = if (searchQuery.isEmpty()) "暂无联系人" else "未找到匹配的联系人",
                        style = MaterialTheme.typography.bodyLarge,
                        color = Color.Gray
                    )
                }
            } else {
                // 显示联系人列表
                LazyColumn {
                    items(filteredContacts) { contact ->
                        ContactItem(
                            contact = contact,
                            onClick = { onContactClick(contact.id) }
                        )
                        Divider(
                            modifier = Modifier.padding(start = 72.dp),
                            thickness = 0.5.dp
                        )
                    }
                }
            }
        }
    }
}

/**
 * 联系人项目组件
 */
@Composable
private fun ContactItem(
    contact: Contact,
    onClick: () -> Unit
) {
    Row(
        modifier = Modifier
            .fillMaxWidth()
            .clickable(onClick = onClick)
            .padding(16.dp),
        verticalAlignment = Alignment.CenterVertically
    ) {
        // 头像
        Box(
            modifier = Modifier
                .size(40.dp)
                .clip(CircleShape),
            contentAlignment = Alignment.Center
        ) {
            if (contact.avatarResId != null) {
                Image(
                    painter = painterResource(id = contact.avatarResId),
                    contentDescription = "联系人头像",
                    modifier = Modifier.fillMaxSize(),
                    contentScale = ContentScale.Crop
                )
            } else {
                // 使用首字母作为头像
                Box(
                    modifier = Modifier
                        .fillMaxSize()
                        .clip(CircleShape)
                        .padding(8.dp)
                        .align(Alignment.Center),
                    contentAlignment = Alignment.Center
                ) {
                    Text(
                        text = contact.name.first().toString(),
                        style = MaterialTheme.typography.titleMedium,
                        color = MaterialTheme.colorScheme.onPrimary
                    )
                }
            }
        }
        
        Spacer(modifier = Modifier.width(16.dp))
        
        // 联系人信息
        Column(
            modifier = Modifier.weight(1f)
        ) {
            Text(
                text = contact.name,
                style = MaterialTheme.typography.bodyLarge.copy(
                    fontWeight = FontWeight.SemiBold
                )
            )
            
            Spacer(modifier = Modifier.height(4.dp))
            
            Text(
                text = contact.status,
                style = MaterialTheme.typography.bodyMedium,
                color = Color.Gray
            )
        }
    }
}

/**
 * 联系人数据类
 */
data class Contact(
    val id: String,
    val name: String,
    val avatarResId: Int? = null,
    val status: String,
    val isOnline: Boolean = false
)

/**
 * 生成示例联系人数据
 */
private fun getDummyContacts(): List<Contact> {
    return listOf(
        Contact(
            id = "1",
            name = "张三",
            status = "在线",
            isOnline = true
        ),
        Contact(
            id = "2",
            name = "李四",
            status = "10分钟前在线",
            isOnline = false
        ),
        Contact(
            id = "3",
            name = "王五",
            status = "正在输入...",
            isOnline = true
        ),
        Contact(
            id = "4",
            name = "赵六",
            status = "2小时前在线",
            isOnline = false
        ),
        Contact(
            id = "5",
            name = "钱七",
            status = "在线",
            isOnline = true
        ),
        Contact(
            id = "6",
            name = "孙八",
            status = "1天前在线",
            isOnline = false
        ),
        Contact(
            id = "7",
            name = "周九",
            status = "3天前在线",
            isOnline = false
        ),
        Contact(
            id = "8",
            name = "吴十",
            status = "1周前在线",
            isOnline = false
        )
    )
} 